<template>
  <div>
    <div><search-item></search-item></div>
    <div class="mt20">
      <el-table
        v-loading="loading"
        element-loading-text="拼命加载中"
        :data="tableData"
        border
        size="mini"
        width="1500"
        height="600"
      >
        <el-table-column
          prop="id"
          label="交易ID"
          width="260"
        >
        </el-table-column>
        <el-table-column
          width="120"
          prop="account_bo"
          label="用户手机"
        >
        </el-table-column>
        <el-table-column
          prop="user_num_bo"
          label="用户ID">
        </el-table-column>

        <el-table-column
          prop="nickname_bo"
          label="用户昵称">
        </el-table-column>
        <el-table-column
          prop="source"
          label="订单类型">
          <template slot-scope="scope">
            <span v-if="scope.row.type==1">购买课程</span>
            <span v-if="scope.row.type==2">购买短信</span>
            <span v-if="scope.row.type==3">打赏</span>
          </template>
        </el-table-column>
        <el-table-column
          prop="course_num_bo"
          label="课程ID">
        </el-table-column>
        <el-table-column
          prop="order_time"
          width="150"
          label="订单来源">
          <template slot-scope="scope">
            {{scope.row.source==='1'?'PC':(scope.row.source==='2'?'Android':(scope.row.source==='3'?'IOS':'WEB'))}}
          </template>
        </el-table-column>
        <el-table-column
          prop="order_time"
          width="150"
          label="订单珍珠">
        </el-table-column>
        <el-table-column
          prop="order_time"
          width="150"
          label="交易完成时间">
        </el-table-column>
        <el-table-column
          label="退款状态">
          <template slot-scope="scope">
            {{scope.row.refund_status==='0'?'未退款':(scope.row.source==='1')?'待退款':'已退款'}}
          </template>
        </el-table-column>
      </el-table>
    </div>
    <div class="block mt10 tc mb10">
      <el-pagination
        background
        @current-change="handleCurrentChange"
        :current-page.sync="page"
        :page-size="pageSize"
        layout="total, prev, pager, next"
        :total="total">
      </el-pagination>
      <br>
    </div>
  </div>
</template>
<script>
  import service from '@/service'
  import searchItem from './studentOrderSearch';
  export default {
    data(){
      return {
        tableData:[],
        loading:true,
        page:1,
        pageSize:15,
        total:0
      }
    },
    mounted(){
      this.getQueryDataList();
    },
    methods:{
      async  getQueryDataList(){
        let result =await service.haiBeiServerTradeList();
        if(result.success){
          this.tableData=result.data;
          this.loading=false;
          this.total=result.total;
        }
      },
      handleCurrentChange(val){
        console.log(val);
      }
    },
    components:{
      searchItem
    }

  }
</script>

